<template>
  <div class="main-body">
    <!-- 工具栏 -->
    <cm-table ref="tableRef" oprWidth="280"  :get-page="listPage" :filters="filters" :columns="columns" :operations="operations"
      @handleEdit="handleEdit" @handleDelete="handleDelete"></cm-table>
  </div>
</template>

<script setup>
import { listPage } from '@/apis/app';
const { t } = useI18n();
const tableRef = ref();
const filters = reactive({ name: '' });
const columns = computed(() => [
  { type: 'selection' , selectable: isSelectable, fixed: 'left'},
  { prop: 'appCode', label: t('thead.appCode'), minWidth: 80, fixed: 'left' },
  { prop: 'appName', label: t('thead.appName'), minWidth: 150 },
  { prop: 'versionName', label: t('thead.versionName'), minWidth: 120},
  { prop: 'versionNumber', label: t('thead.versionNumber'), minWidth: 120 },
  { prop: 'buildTime', label: t('thead.buildTime'), minWidth: 180 },
  { prop: 'isForce', label: t('thead.isForce'), minWidth: 120 },
  { prop: 'versionStatus', type: 'switch',  label: t('thead.versionStatus'), minWidth: 150},
  { prop: 'commitTime', label: t('thead.commitTime'), minWidth: 180 },
]);

const operations = [
  {
    type: 'view',
    label: t('action.view'),
    isShowIcon: true
  },
  {
    type: 'refresh',
    label: t('action.refresh'),
    isShowIcon: true
  },
  {
    type: 'download',
    label: t('action.download'),
    isShowIcon: true
  },
  {
    type: 'delete',
    isShowIcon: true
  },
];

function isSelectable(row) {
  return row.createdBy !== 'system';
}

function findPage() {
  tableRef.value.reload();
}

function handleEdit(row) {
  console.log('edit', row);
}

function handleDelete(ids, callback) {
  console.log('delete', ids, callback);
}
</script>


